import React, { FC, useEffect, useState } from "react"
//antd
import { Table, Switch } from "antd"
//icon
import { observer } from 'mobx-react-lite';
import useStore from "@/context/useStore";
import { getCookie } from "@/utils/auth";
interface IuserList {
  code: number
  disabled: boolean
  gender: string
  houseCount: number
  nickname: string
  phone: null
  username: string
}
interface Iparams {
  id: number,
  disabled: boolean,
}
const UserList: FC = () => {
  const columns = [
    {
      title: 'Id',
      dataIndex: 'code',
    },
    {
      title: '用户名',
      dataIndex: 'username',
    },
    {
      title: '用户昵称',
      dataIndex: 'nickname',
    },
    {
      title: '房产数量',
      dataIndex: 'houseCount',
    },
    {
      title: '操作',
      render: (row: IuserList) => {
        return <Switch defaultChecked={row.disabled} checkedChildren="开启" unCheckedChildren="关闭" onChange={() => changeFlag(row.code as number, row.disabled)} />
      }
    },
  ];
  const {user} =useStore();
 function changeFlag(id:number,disabled:boolean){
  
   let params={
     id,
     disabled,
   }
    user.isDisabled(params).then(ok=>{
      if(ok.status==200){
        alert(ok.description)
      }else{
        alert(ok.description)
      }
    })
  }
  useEffect(() => {
    user.getUserList(getCookie())
  }, []);
  return <div className="user">
    <Table columns={columns} dataSource={user.userList} />
  </div>
}

export default observer(UserList)
